<html>
<head>

<script type="text/javascript" src="./graph/Node.js"></script>
<script type="text/javascript" src="./graph/Edge.js"></script>
<script type="text/javascript" src="./graph/Graph.js"></script>

<script type="text/javascript" src="./parser/exceptions/LexicalException.js"></script>
<script type="text/javascript" src="./parser/exceptions/SintacticException.js"></script>

<script type="text/javascript" src="./parser/QuadCollection.js"></script>

<script type="text/javascript" src="./parser/Parser.js"></script>

<script type="text/javascript" src="./dot2canvas.js"></script>

<script type="text/javascript">

var perform = function() {
	dot2canvas(document.getElementById("dotScript").value);
};

</script>

</head>
<body>

<textarea rows="28" cols="60" id="dotScript">
digraph G {

	subgraph cluster_0 {
		style=filled;
		color=lightgrey;
		node [style=filled,color=white];
		a0 -> a1 -> a2 -> a3;
		label = "process #1";
	}

	subgraph cluster_1 {
		node [style=filled];
		b0 -> b1 -> b2 -> b3;
		label = "process #2";
		color=blue
	}
	start -> a0;
	start -> b0;
	a1 -> b3;
	b2 -> a3;
	a3 -> a0;
	a3 -> end;
	b3 -> end;

	start [shape=Mdiamond];
	end [shape=Msquare];
}
</textarea>
<br/>
<button onclick="javascript:perform();">Generate Graph</button>

</body>
</html>